.nextra-hamburger svg {
  g,
  path {
    @apply x:motion-reduce:transition-none!;
  }

  --animation: transform 0.15s cubic-bezier(0.25, 1, 0.5, 1);

  g {
    @apply x:origin-center;
    transition: var(--animation);
  }

  path {
    opacity: 1;
    transition:
      var(--animation) 0.15s,
      opacity 0.15s ease 0.15s;
  }

  &.open {
    path {
      transition:
        var(--animation),
        opacity 0s ease 0.15s;
    }

    & > path {
      opacity: 0;
    }

    g {
      transition: var(--animation) 0.15s;

      &:nth-of-type(1) {
        transform: rotate(45deg);

        path {
          transform: translate3d(0, 6px, 0);
        }
      }

      &:nth-of-type(2) {
        transform: rotate(-45deg);

        path {
          transform: translate3d(0, -6px, 0);
        }
      }
    }
  }
}
